<div id="tb1<?php echo $uniqid;?>" style="padding:5px">
    <table cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td><a href="javascript:;" onclick="infoadd(1);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-tianjia1"></i><span class="l-btn-text">增加</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infoedit(1);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-bianji"></i><span class="l-btn-text">编辑</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infodelete(1);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shanchu"></i><span class="l-btn-text">删除</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="inforeload(1);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shuaxin"></i><span class="l-btn-text">重载</span></span></a></td>
        </tr>
        </tbody>
    </table>
</div>
<div id="tb2<?php echo $uniqid;?>" style="padding:5px">
    <table cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td><a href="javascript:;" onclick="infoadd(2);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-tianjia1"></i><span class="l-btn-text">增加</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infoedit(2);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-bianji"></i><span class="l-btn-text">编辑</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infodelete(2);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shanchu"></i><span class="l-btn-text">删除</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="inforeload(2);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shuaxin"></i><span class="l-btn-text">重载</span></span></a></td>
        </tr>
        </tbody>
    </table>
</div>
<div id="tb3<?php echo $uniqid;?>" style="padding:5px">
    <table cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td><a href="javascript:;" onclick="infoadd(3);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-tianjia1"></i><span class="l-btn-text">增加</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infoedit(3);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-bianji"></i><span class="l-btn-text">编辑</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infodelete(3);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shanchu"></i><span class="l-btn-text">删除</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="inforeload(3);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shuaxin"></i><span class="l-btn-text">重载</span></span></a></td>
        </tr>
        </tbody>
    </table>
</div>
<div id="tb4<?php echo $uniqid;?>" style="padding:5px">
    <table cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td><a href="javascript:;" onclick="infoadd(4);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-tianjia1"></i><span class="l-btn-text">增加</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infoedit(4);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-bianji"></i><span class="l-btn-text">编辑</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infodelete(4);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shanchu"></i><span class="l-btn-text">删除</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="inforeload(4);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shuaxin"></i><span class="l-btn-text">重载</span></span></a></td>
        </tr>
        </tbody>
    </table>
</div>
<div id="tb5<?php echo $uniqid;?>" style="padding:5px">
    <table cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td><a href="javascript:;" onclick="infoadd(5);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-tianjia1"></i><span class="l-btn-text">增加</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infoedit(5);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-bianji"></i><span class="l-btn-text">编辑</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infodelete(5);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shanchu"></i><span class="l-btn-text">删除</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="inforeload(5);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shuaxin"></i><span class="l-btn-text">重载</span></span></a></td>
        </tr>
        </tbody>
    </table>
</div>
<div id="tb6<?php echo $uniqid;?>" style="padding:5px">
    <table cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td><a href="javascript:;" onclick="infoadd(6);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-tianjia1"></i><span class="l-btn-text">增加</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infoedit(6);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-bianji"></i><span class="l-btn-text">编辑</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="infodelete(6);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shanchu"></i><span class="l-btn-text">删除</span></span></a></td>
            <td>
                <div class="datagrid-btn-separator"></div>
            </td>
            <td><a href="javascript:;" onclick="inforeload(6);" class="l-btn l-btn-small l-btn-plain"><span class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shuaxin"></i><span class="l-btn-text">重载</span></span></a></td>
        </tr>
        </tbody>
    </table>
</div>

<div class="easyui-tabs info-tabs">
    <div title="项目配置" class="con" onselectstart="return false;" style="-moz-user-select:none;">
        <table id="info1"></table>
    </div>
    <div title="支付宝信息" class="con" onselectstart="return false;" style="-moz-user-select:none;">
        <table id="info2"></table>
    </div>
    <div title="微信账号" class="con" onselectstart="return false;" style="-moz-user-select:none;">
        <table id="info3"></table>
    </div>
    <div title="七牛CDN" class="con" onselectstart="return false;" style="-moz-user-select:none;">
        <table id="info4"></table>
    </div>
    <div title="阿里短信" class="con" onselectstart="return false;" style="-moz-user-select:none;">
        <table id="info5"></table>
    </div>
    <div title="极光推送" class="con" onselectstart="return false;" style="-moz-user-select:none;">
        <table id="info6"></table>
    </div>
</div>

<div id="infodlg" class="easyui-dialog" style="width:720px; height:460px;" title="信息框" closed="true"></div>

<script>
    var infoadd = function (type) {
        $("#infodlg").dialog({
            title: '新增信息',
            closed: false,
            width: 700,
            height: 430,
            cache: false,
            href: '/admin/main/infoadd?type=' + type,
            modal: true,
            buttons: [{
                text: '保存',
                id: 'infoaddsubmit',
                iconCls: 'icon-ok',
            }, {
                text: '关闭',
                iconCls: 'icon-no',
                handler: function () {
                    $("#infodlg").dialog('close');
                }
            }]
        });
    };
    var infoedit = function (type) {
        var row = $('#info' + type).datagrid('getSelected');
        if (row) {
            $("#infodlg").dialog({
                title: '编辑信息',
                closed: false,
                width: 700,
                height: 430,
                cache: false,
                href: '/admin/main/infoedit?id=' + row.id + '&type=' + type,
                modal: true,
                buttons: [{
                    text: '保存',
                    id: 'infoupdatesubmit',
                    iconCls: 'icon-ok',
                }, {
                    text: '关闭',
                    iconCls: 'icon-no',
                    handler: function () {
                        $("#infodlg").dialog('close');
                    }
                }]
            });
        } else {
            $.messager.alert('提示', '请先选择要编辑的行！', 'warning');
        }
    };
    var infodelete = function (type) {
        var row = $('#info' + type).datagrid('getSelected');
        if (row) {
            $.messager.confirm('提示', '确定删除吗？', function (r) {
                if (r == true) {
                    $.messager.progress();
                    $.post('/admin/main/infodelete', {id: row.id}, function (data) {
                        $.messager.progress('close');
                        if (data.ret == 0) {
                            $.messager.show({
                                title: '提示',
                                msg: data.msg,
                                timeout: 3000,
                                showType: 'slide'
                            });
                            inforeload(type);
                        } else {
                            $.messager.alert('提示', data.msg, 'warning');
                        }
                    }, 'json');
                }
            });
        } else {
            $.messager.alert('提示', '请先选择要删除的行！', 'warning');
        }
    };
    var inforeload = function (type) {
        $("#info" + type).datagrid('reload');
    };
    var infosearch = function () {
        var height = $(window).height() - $(".top").height() - 68 - 31;
        var width = $(window).width() - $(".leftmenu").width() - 13;
        $("#info1").datagrid({
            width: width,
            height: height,//高度
            singleSelect: true,//如果为true，则只允许选择一行
            striped: true,//是否显示斑马线效果。
            rownumbers: true,//如果为true，则显示一个行号列。
            pagination: true,//是否显示分页
            pageSize: 10,
            pageList: [10, 15, 20, 25],
            method: 'post',
            sortName: 'id',
            sortOrder: 'asc',
            url: '/admin/main/infoGet',
            queryParams: {type: 1},
            fitColumns: true,//真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动。
            nowrap: true,//如果为true，则在同一行中显示数据。设置为true可以提高加载性能。 是否换行
            selectOnCheck: false,
            checkOnSelect: true,
            toolbar: '#tb1<?php echo $uniqid;?>',
            columns: [[
                {field: 'title', title: '名称', width: '10%', editor: 'text', styler: enableEditStyler},
                {field: 'key', title: '键', width: '10%', sortable: true, editor: 'text', styler: enableEditStyler},
                {field: 'value', title: '值', width: '35%', editor: 'text', styler: enableEditStyler},
                {field: 'created_at', title: '创建时间', width: '15%', editor: 'datetimebox'},
                {field: 'updated_at', title: '更新时间', width: '15%', editor: 'datetimebox'},
            ]],
            onDblClickCell: onDblClickCell,
            onEndEdit: onEndEdit,
        });
        $("#info2").datagrid({
            width: width,
            height: height,//高度
            singleSelect: true,//如果为true，则只允许选择一行
            striped: true,//是否显示斑马线效果。
            rownumbers: true,//如果为true，则显示一个行号列。
            pagination: true,//是否显示分页
            pageSize: 10,
            pageList: [10, 15, 20, 25],
            method: 'post',
            sortName: 'id',
            sortOrder: 'asc',
            url: '/admin/main/infoGet',
            queryParams: {type: 2},
            fitColumns: true,//真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动。
            nowrap: true,//如果为true，则在同一行中显示数据。设置为true可以提高加载性能。 是否换行
            selectOnCheck: false,
            checkOnSelect: true,
            toolbar: '#tb2<?php echo $uniqid;?>',
            columns: [[
                {field: 'title', title: '名称', width: '10%', editor: 'text', styler: enableEditStyler},
                {field: 'key', title: '键', width: '10%', sortable: true, editor: 'text', styler: enableEditStyler},
                {field: 'value', title: '值', width: '35%', editor: 'text', styler: enableEditStyler},
                {field: 'created_at', title: '创建时间', width: '15%', editor: 'datetimebox'},
                {field: 'updated_at', title: '更新时间', width: '15%', editor: 'datetimebox'},
            ]],
            onDblClickCell: onDblClickCell,
            onEndEdit: onEndEdit,
        });
        $("#info3").datagrid({
            width: width,
            height: height,//高度
            singleSelect: true,//如果为true，则只允许选择一行
            striped: true,//是否显示斑马线效果。
            rownumbers: true,//如果为true，则显示一个行号列。
            pagination: true,//是否显示分页
            pageSize: 10,
            pageList: [10, 15, 20, 25],
            method: 'post',
            sortName: 'id',
            sortOrder: 'asc',
            url: '/admin/main/infoGet',
            queryParams: {type: 3},
            fitColumns: true,//真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动。
            nowrap: true,//如果为true，则在同一行中显示数据。设置为true可以提高加载性能。 是否换行
            selectOnCheck: false,
            checkOnSelect: true,
            toolbar: '#tb3<?php echo $uniqid;?>',
            columns: [[
                {field: 'title', title: '名称', width: '10%', editor: 'text', styler: enableEditStyler},
                {field: 'key', title: '键', width: '10%', sortable: true, editor: 'text', styler: enableEditStyler},
                {field: 'value', title: '值', width: '35%', editor: 'text', styler: enableEditStyler},
                {field: 'created_at', title: '创建时间', width: '15%', editor: 'datetimebox'},
                {field: 'updated_at', title: '更新时间', width: '15%', editor: 'datetimebox'},
            ]],
            onDblClickCell: onDblClickCell,
            onEndEdit: onEndEdit,
        });
        $("#info4").datagrid({
            width: width,
            height: height,//高度
            singleSelect: true,//如果为true，则只允许选择一行
            striped: true,//是否显示斑马线效果。
            rownumbers: true,//如果为true，则显示一个行号列。
            pagination: true,//是否显示分页
            pageSize: 10,
            pageList: [10, 15, 20, 25],
            method: 'post',
            sortName: 'id',
            sortOrder: 'asc',
            url: '/admin/main/infoGet',
            queryParams: {type: 4},
            fitColumns: true,//真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动。
            nowrap: true,//如果为true，则在同一行中显示数据。设置为true可以提高加载性能。 是否换行
            selectOnCheck: false,
            checkOnSelect: true,
            toolbar: '#tb4<?php echo $uniqid;?>',
            columns: [[
                {field: 'title', title: '名称', width: '10%', editor: 'text', styler: enableEditStyler},
                {field: 'key', title: '键', width: '10%', sortable: true, editor: 'text', styler: enableEditStyler},
                {field: 'value', title: '值', width: '35%', editor: 'text', styler: enableEditStyler},
                {field: 'created_at', title: '创建时间', width: '15%', editor: 'datetimebox'},
                {field: 'updated_at', title: '更新时间', width: '15%', editor: 'datetimebox'},
            ]],
            onDblClickCell: onDblClickCell,
            onEndEdit: onEndEdit,
        });
        $("#info5").datagrid({
            width: width,
            height: height,//高度
            singleSelect: true,//如果为true，则只允许选择一行
            striped: true,//是否显示斑马线效果。
            rownumbers: true,//如果为true，则显示一个行号列。
            pagination: true,//是否显示分页
            pageSize: 10,
            pageList: [10, 15, 20, 25],
            method: 'post',
            sortName: 'id',
            sortOrder: 'asc',
            url: '/admin/main/infoGet',
            queryParams: {type: 5},
            fitColumns: true,//真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动。
            nowrap: true,//如果为true，则在同一行中显示数据。设置为true可以提高加载性能。 是否换行
            selectOnCheck: false,
            checkOnSelect: true,
            toolbar: '#tb5<?php echo $uniqid;?>',
            columns: [[
                {field: 'title', title: '名称', width: '10%', editor: 'text', styler: enableEditStyler},
                {field: 'key', title: '键', width: '10%', sortable: true, editor: 'text', styler: enableEditStyler},
                {field: 'value', title: '值', width: '35%', editor: 'text', styler: enableEditStyler},
                {field: 'created_at', title: '创建时间', width: '15%', editor: 'datetimebox'},
                {field: 'updated_at', title: '更新时间', width: '15%', editor: 'datetimebox'},
            ]],
            onDblClickCell: onDblClickCell,
            onEndEdit: onEndEdit,
        });
        $("#info6").datagrid({
            width: width,
            height: height,//高度
            singleSelect: true,//如果为true，则只允许选择一行
            striped: true,//是否显示斑马线效果。
            rownumbers: true,//如果为true，则显示一个行号列。
            pagination: true,//是否显示分页
            pageSize: 10,
            pageList: [10, 15, 20, 25],
            method: 'post',
            sortName: 'id',
            sortOrder: 'asc',
            url: '/admin/main/infoGet',
            queryParams: {type: 6},
            fitColumns: true,//真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动。
            nowrap: true,//如果为true，则在同一行中显示数据。设置为true可以提高加载性能。 是否换行
            selectOnCheck: false,
            checkOnSelect: true,
            toolbar: '#tb6<?php echo $uniqid;?>',
            columns: [[
                {field: 'title', title: '名称', width: '10%', editor: 'text', styler: enableEditStyler},
                {field: 'key', title: '键', width: '10%', sortable: true, editor: 'text', styler: enableEditStyler},
                {field: 'value', title: '值', width: '35%', editor: 'text', styler: enableEditStyler},
                {field: 'created_at', title: '创建时间', width: '15%', editor: 'datetimebox'},
                {field: 'updated_at', title: '更新时间', width: '15%', editor: 'datetimebox'},
            ]],
            onDblClickCell: onDblClickCell,
            onEndEdit: onEndEdit,
        });
    };
    infosearch();

    var enableEditStyler = function (value, row, index) {
        return 'color:gray; font-style:italic;';
    };
    var editIndex = undefined;

    function endEditing(type) {
        if (editIndex == undefined) {
            return true;
        }
        if ($('#info' + type).datagrid('validateRow', editIndex)) {
            $('#info' + type).datagrid('endEdit', editIndex);
            editIndex = undefined;
            return true;
        } else {
            return false;
        }
    }

    function onDblClickCell(rowIndex, field, value) {
        var selectedRow = $(this).datagrid('getSelected');
        var type = selectedRow.type;
        if (endEditing(type)) {
            $('#info' + type).datagrid('selectRow', rowIndex)
                .datagrid('editCell', {index: rowIndex, field: field});
            editIndex = rowIndex;
        }

        $("input.datagrid-editable-input,span.datebox input.textbox-text").val(value).bind("blur", function (evt) {
            var dataArry = $('#info' + type).datagrid('getSelections');
            $('#info' + type).datagrid('endEdit', rowIndex);
        }).bind("keyup", function (evt) {
            if (evt.keyCode == 13) {
                this.blur();
            }
        }).focus();
    }

    $.extend($.fn.datagrid.methods, {
        editCell: function (jq, param) {
            return jq.each(function () {
                var opts = $(this).datagrid('options');
                var fields = $(this).datagrid('getColumnFields', true).concat($(this).datagrid('getColumnFields'));
                for (var i = 0; i < fields.length; i++) {
                    var col = $(this).datagrid('getColumnOption', fields[i]);
                    col.editor1 = col.editor;
                    if (fields[i] != param.field) {
                        col.editor = null;
                    }
                }
                $(this).datagrid('beginEdit', param.index);
                for (var i = 0; i < fields.length; i++) {
                    var col = $(this).datagrid('getColumnOption', fields[i]);
                    col.editor = col.editor1;
                }
            });
        }
    });

    function isEmptyObject(e) {
        var t;
        for (t in e)
            return !1;
        return !0;
    }

    function onEndEdit(index, row, changes) {
        if (isEmptyObject(changes)) {
            editRow = undefined;
            $('#info1').datagrid('unselectAll');
            $('#info2').datagrid('unselectAll');
            $('#info3').datagrid('unselectAll');
            $('#info4').datagrid('unselectAll');
            $('#info5').datagrid('unselectAll');
            $('#info6').datagrid('unselectAll');
            return false;
        } else {
            submitForms(row.id, changes);
        }
    }

    function submitForms(id, changes) {
        changes.id = id;
        $.post('/admin/main/infoCellUpdate', {data: changes}, function (data) {
            console.log(data);
            if (data.ret == 0) {
                $.messager.show({
                    title: '提示',
                    msg: data.msg,
                    timeout: 3000,
                    showType: 'slide'
                });
                inforeload(type);
            } else {
                $.messager.alert('提示', data.msg, 'warning');
            }
        });
    }
</script>
